div {
  box-sizing: border-box;
}

.board {
  width: 84vw;
  margin: auto;
}

.board .field {
  float:left;
  border: 1px solid black;
  width: 12vw;
  height: 12vw;
}

.board .field .piece {
  width: 10vw;
  height: 10vw;
  border-radius: 50%;
  margin: 1vw;
}

.board .field .color-a {
  background-color: blue;
}

.board .field .color-b {
  background-color: red;
}

@media screen and (min-width: 60em) {
  .board { 
    width: 49vw; 
  }

  .board .field {
    width: 7vw;
    height: 7vw;
  }

  .board .field .piece {
    width: 5vw;
    height: 5vw;
    margin: 1vw;
  }
}

